<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML >
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'index.jsp' starting page</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
    <script type="text/javascript" src="jslib/jquery-easyui-1.3.1/jquery-1.8.0.min.js"></script>
    <script type="text/javascript" src="jslib/jquery-easyui-1.3.1/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="jslib/jquery-easyui-1.3.1/locale/easyui-lang-zh_CN.js"></script>
    <link rel="stylesheet" href="jslib/jquery-easyui-1.3.1/themes/default/easyui.css" type="text/css"></link>
    <link rel="stylesheet" href="jslib/jquery-easyui-1.3.1/themes/icon.css" type="text/css"></link>
    <script>
      $.extend($.fn.validatebox.defaults.rules, {
	   eqPwde : {/* 验证两次密码是否一致功能 */
		validator : function(value, param) {
 			return value == $(param[0]).val();
		},
		message : '密码不一致！'
	   }
});
    
    </script>
    
    </head>
    
  <body class="easyui-layout">
     <div data-options="region:'north',title:'north title'" style="height:60px"></div>
     <div data-options="region:'south',title:'south title'" style="height:30px"></div>
     
     <div data-options="region:'west',split:true" style="width:200px">
       <div class="easyui-panel" data-options="title:'west titel',border:false,fit:true"></div>
     </div>
      <div data-options="region:'east',title:'east title'" style="width:200px"></div>
      <div data-options="region:'center',title:'center title'" style="padding:5px;background:#eee;"></div>
     <div id="index_logDialog">
      <form id="index_logForm" method="post">
		   <table>
		      <tr>
		       <th>登录名</th>
		       <th><input name="name" class="easyui-validatebox" data-options="
		            required:true,
		            validType:'email',
		            missingMessage:'用户名必填项',
 		          "/>
		        </th>
		     </tr>
		     <tr>
		       <th>密码</th>
		       <th><input name="pwd" type="password" class="easyui-validatebox" data-options="required:true"/></th>
		    </tr>
		 </table>
    </form>
   </div>
   
   <div id="index_regDialog" style="width:250px">
     <form id="index_regForm" method="post">
 	   <table>
	     <tr>
		       <th>登录名</th>
		       <th>
		         <input name="name" class="easyui-validatebox" data-options="
		            required:true,
		            validType:'email',
		            missingMessage:'用户名必填项',
		            invalidMessage:'请填写用户名!'
		          "/>
		      </th>
	       </tr>
	      <tr>
		       <th>密码</th>
		       <th><input name="pwd" type="password" class="easyui-validatebox" data-options="required:true"/></th>
		       </tr>
		       <tr>
		       <th>重复密码</th>
		       <th><input name="repwd" type="password" class="easyui-validatebox" data-options="required:true,validType:'eqPwd[\'#regForm input[name=pwd]\']'"/></th>
	       </tr>
	     </table>
	  </form>
   </div>
   
  </body>
<script>
   $(function(){
        $('#index_regDialog').dialog({
          title:'注册',
	      modal:true,
	      closable:true,
	      closed:true,
	      buttons:[{
					text:'注册',
					iconCls:'icon-edit',
					handler:function(){
					  // $('#index_regForm').submit();
					  regUser();
					  
					}
				}]
       });
   
   $('#index_logDialog').dialog({
          title:'登录',
	      modal:true,
	      closable:false,
	      buttons:[{
					text:'注册',
					iconCls:'icon-edit',
					handler:function(){
					//$('#index_regDialog').form('load',{name:'',pwd:'',repwd:''});
					  $('#index_regDialog form input').val('');//清空
					  $('#index_regDialog').dialog('open');
					}
				},{
					text:'登录',
					iconCls:'icon-help',
					handler:function(){alert('help')}
				}]
   });
   
 /* $('#index_regForm').form({//form 初始化
	     /* url:'${pageContext.request.contextPath}/userAction!reg.action',
	     success:function(data){     
	 	      var json=jQuery.parseJSON(data);
	 	      alert(json.success+","+json.msg);
	 	      if(json.success){
	 	         $('#index_regDialog').dialog('close');
	 	      }
	 	     $.messager.show({
				title:'提示',
				msg:json.msg
	          });
	     } 
  
    }); */
 });
 
  function regUser(){//此种ajax提交没有数据验证
     if( $('#index_regForm').form('validate')){// $('#index_regForm').form('validate') 表单验证
       $.ajax({
		  url:'${pageContext.request.contextPath}/userAction!reg.action',
	      data:$('#index_regForm').serialize(),
	      /* {
	        name:$('#index_regForm input[name=name]').val();
	        pwd:$('#index_regForm input[name=pwd]').val()
	      }, */
	      dataType:'json',
	      success:function (json,status,jqXHR){
	            //  var json=jQuery.parseJSON(data);
 		 	      if(json.success){
		 	         $('#index_regDialog').dialog('close');
		 	      }
		 	     $.messager.show({
					title:'提示',
					msg:json.msg
		          });
	       }
        });
     }
  }
 
    </script>
</html>
